<template>
  <p-modal
    v-model="visible"
    :mask-closable="false"
    :width="1100"
    :title="title"
    :footer="null"
  >
    <p-spin :spinning="spinning">
      <page style="padding: 0; border: none;">
        <template slot="title">基础信息</template>
        <div class="table-page-search-wrapper">
          <p-form :label-col="{span: 6}" :wrapper-col="{span: 18}">
            <p-row :gutter="24">
              <p-col :xl="8">
                <p-form-item label="车间">{{ item.workroomName }}</p-form-item>
              </p-col>
              <p-col :xl="8">
                <p-form-item label="班组">{{ item.workclassName }}</p-form-item>
              </p-col>
              <p-col :xl="8">
                <p-form-item label="线体">{{ item.lineName }}</p-form-item>
              </p-col>
              <p-col :xl="8">
                <p-form-item label="产品编码">{{ item.productCode }}</p-form-item>
              </p-col>
              <p-col :xl="8">
                <p-form-item label="产品型号">{{ item.productModle }}</p-form-item>
              </p-col>
              <p-col :xl="8">
                <p-form-item label="工序工单">{{ item.processBillNo }}</p-form-item>
              </p-col>
              <p-col :xl="8">
                <p-form-item label="点检人员">{{ item.personnel }}</p-form-item>
              </p-col>
              <p-col :xl="8">
                <p-form-item label="点检时间">{{ item.theTallyTime ? timestampToDatetime(item.theTallyTime) : '' }}</p-form-item>
              </p-col>
              <p-col :xl="8">
                <p-form-item label="检验模板">{{ item.spotcheckTemplate }}</p-form-item>
              </p-col>
              <p-col :xl="8">
                <p-form-item label="检验状态">{{ item.istates === 1 ? '已检验' : '待检验'}}</p-form-item>
              </p-col>
              <p-col :xl="8">
                <p-form-item label="检验判定">{{ item.decide === 1 ? '合格' : (item.decide === 0 ? '不合格' : '') }}</p-form-item>
              </p-col>
            </p-row>
          </p-form>
        </div>
        <div class="product-execu-title mt20">检验项目</div>
        <p-table
          :columns="columns"
          :data-source="dataSource"
          :pagination="false"
          row-key="checkProjectCode"
          size="small"
          bordered
        />
      </page>
    </p-spin>
  </p-modal>
</template>

<script>
import Page from './page'
import spotCheckMixin from './spot-check-mixin'
import { getAction } from '@/api/manage'
import { timestampToDatetime } from '@/utils/util'

export default {
  mixins: [spotCheckMixin],
  components: {
    Page
  },
  data() {
    return {
      spinning: false,
      item: {}
    }
  },
  computed: {
    title() {
      return `开线点检单——点检单号：${this.item.spotCheckodd}`
    }
  },
  methods: {
    timestampToDatetime,
    initValue() {
      if (this.value) {
        this.getSpotCheckInfo()
      }
      this.visible = this.value
    },
    getSpotCheckInfo() {
      if (this.resource && this.resource.spotCheckOdd) {
        const spotCheckodd = this.resource.spotCheckOdd
        getAction('/mes-manufacture/mfLineTheTally/getCheckInfoBySpotCheckodd', { spotCheckodd }).then(res => {
          this.item = res.data || {}
          this.dataSource = this.item.childs || []
        })
      }
    }
  }
}
</script>
